body {
    background-color: var(--themeColor);
}

.main {

    .carousel {
        height: 7.5rem;

        .layui-carousel {
            height: 7.5rem !important;
            background-color: transparent;

        }

        .layui-carousel > [carousel-item] > * {
            background-color: transparent;
        }
    }

    .carousel .layui-carousel > div[carousel-item] img {
        width: 100%;
        height: 100%;
    }

    .layui-carousel-ind {
        top: -45px;
    }

    .layui-carousel-ind ul {
        background-color: initial;
    }

    .pos-box {
        position: absolute;
        top: 7.2rem;
        width: 100%;
    }

    .card {
        background: var(--ff);
        border-radius: .3rem .3rem 0 0;
        padding: .3rem;


        .price {
            .vip-price {
                font-weight: bold;
                font-size: .4rem;
                color: var(--bd);
            }

            .price {
                font-size: .24rem;
                color: var(--c9);
                margin-left: .15rem;
                text-decoration-line: line-through;
                margin-top: .03rem;
            }

            .front:before {
                content: '￥';
                font-size: var(--default-font-size-28);
            }
        }

        .title {
            font-size: var(--default-font-size-28);
            font-weight: bold;
            color: var(--dcl);
            padding: .3rem 0;
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 3;
            overflow: hidden;
            text-overflow: ellipsis;
        }

        .desc {
            font-size: .24rem;
            color: var(--c9);
        }
    }

    .multi {
        background-color: var(--ff);

        .item {
            padding: .35rem .3rem;
            border-bottom: 1px solid var(--ee);

            .title {
                font-size: var(--default-font-size-26);
                color: var(--c9);
            }

            .value {
                font-size: var(--default-font-size-26);
                color: var(--dcl);
                margin-left: .35rem;
            }

            > img {
                width: .4rem;
                height: .08rem;
            }
        }

        .item:last-child {
            border-bottom: none;
        }
    }

    .holder-title {
        font-size: var(--default-font-size-26);
        color: var(--66);
    }

    .holder-title:after {
        content: '';
        width: .30rem;
        height: .02rem;
        background: var(--66);
        margin-left: .2rem;
        margin-top: .02rem;
    }

    .holder-title:before {
        content: '';
        width: .30rem;
        height: .02rem;
        background: var(--66);
        margin-right: .2rem;
        margin-top: .02rem;
    }

    .content {
        background-color: var(--ff);
        padding-bottom: 1.2rem;

        .content p {
            padding: 0 .3rem;
        }
    }

    .content img {
        width: 100%;
    }

    .pro-footer {
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        background-color: var(--ff);
        text-align: center;
        box-sizing: border-box;
        padding: .15rem .2rem .15rem .3rem;

        .cart-box {
            position: relative;

            > img {
                width: .4rem;
                height: .4rem;
            }

            .title {
                font-size: .24rem;
                color: var(--66);
            }

            .badge {
                position: absolute;
                border-radius: 50%;
                background-color: var(--bd);
                top: -.1rem;
                right: -.05rem;
                font-size: .20rem;
                color: var(--ff);
                width: .32rem;
                height: .32rem;
                line-height: .35rem;
                padding: .01rem .02rem;
            }
        }

        .add-cart {
            background-image: url("/static/index/images/product/add-cart.png");
            background-size: 100% 100%;
            width: 2.96rem;
            height: .72rem;
            line-height: .74rem;
            text-align: center;
            font-size: var(--default-font-size-28);
            color: var(--ff);

        }

        .payment {
            background-image: url("/static/index/images/product/payment.png");
            background-size: 100% 100%;
            text-align: center;
            font-size: var(--default-font-size-28);
            width: 2.58rem;
            height: .72rem;
            line-height: .74rem;
            color: var(--ff);
        }
    }

    .layui-layer {
        border-radius: .30rem .30rem 0 0 !important;
    }

    .layui-layer-content {
        overflow: inherit;
    }

    .model-mdl {
        display: none;
        position: relative;
        background: var(--ff);
        z-index: 29891015;
        border-radius: .30rem .30rem 0 0;

        .icon {
            width: 1.88rem;
            height: 1.88rem;
            position: absolute;
            top: -.6rem;
            left: 0.3rem;
            border-radius: .2rem
        }

        .vip-price {
            font-weight: bold;
            font-size: .4rem;
            color: var(--bd);
            margin-bottom: .1rem;
        }

        .stock {
            font-size: .24rem;
            color: var(--c9);

            margin-top: .03rem;
        }

        .front:before {
            content: '￥';
            font-size: var(--default-font-size-28);
        }

        .top {
            margin-left: calc(1.88rem + 0.3rem);
        }

        .spec-scope {
            .spec {
                .title {
                    font-weight: bold;
                    font-size: var(--default-font-size-26);
                    color: var(--dcl);
                }

                .container {
                    display: flex;
                    flex-wrap: wrap;
                    gap: .16rem;
                }

                .item {
                    font-size: var(--default-font-size-28);
                    color: #666666;
                    padding: .12rem .23rem;
                    background: var(--f6);
                    border-radius: .30rem;
                }
                .lay-this{
                    background: var(--bd);
                    color: var(--ff);
                }
            }
        }

        .num-scope {
            padding-top: .56rem;

            .title {
                font-weight: bold;
                font-size: var(--default-font-size-26);
                color: var(--dcl);
            }

            .edit {
                .val {
                    background: var(--f6);
                    border-radius: 6rpx;
                    padding: .1rem .3rem;
                    margin: 0 .2rem;
                }

                .minus, .plus {
                    font-size: .3rem;
                    font-weight: bold;
                    margin-top: .04rem;
                }
            }
        }

        .btn-scope{
            padding-top: .7rem;
            .add-cart {
                background-image: url("/static/index/images/product/add-cart.png");
                background-size: 100% 100%;
                width: 50%;
                height: .72rem;
                line-height: .74rem;
                text-align: center;
                font-size: var(--default-font-size-28);
                color: var(--ff);

            }

            .payment {
                background-image: url("/static/index/images/product/payment.png");
                background-size: 100% 100%;
                text-align: center;
                font-size: var(--default-font-size-28);
                width: 50%;
                height: .72rem;
                line-height: .74rem;
                color: var(--ff);
            }
        }

    }


}
